<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>列表</title>
    <meta name="viewport" content="initial-scale=1,maximum-scale=1, minimum-scale=1">
    <script type="text/javascript">
        document.documentElement.style.fontSize = document.documentElement.clientWidth / 750*100 + 'px';
    </script>
    <link rel="stylesheet" href="../css/base.css">
    <link rel="stylesheet" href="../css/list.css">
    <link rel="stylesheet" href="../css/footer.css">
    <script src="../js/tab.js"></script>
    <script>
        window.onload = function(){
            tab('leftList','active','productList')
        }
    </script>
</head>
<body>
<div id="wrap">
    <header>
        <p>拼粮</p><a href=""><i class="iconfont">&#xe638;</i></a>
    </header>
    <section>
        <ul id="leftList">
            <li class="active"><a href="javascript:;">农产品</a></li>
            <li><a href="javascript:;">畜牧类产品</a></li>
            <li><a href="javascript:;">特产</a></li>
            <li><a href="javascript:;">精选商品</a></li>
        </ul>
        <div class="productList listBlock">
            <ul>
                <li>
                    <img src="../imgs/1111.jpg" alt="">
                    <p>苹果</p>
                </li>
                <li>
                    <img src="../imgs/2222.jpg" alt="">
                    <p>橙子</p>
                </li>
                <li>
                    <img src="../imgs/3333.jpg" alt="">
                    <p>梨</p>
                </li>
                <li>
                    <img src="../imgs/4444.jpg" alt="">
                    <p>牛油果</p>
                </li>
                <li>
                    <img src="../imgs/1111.jpg" alt="">
                    <p>苹果</p>
                </li>
                <li>
                    <img src="../imgs/2222.jpg" alt="">
                    <p>橙子</p>
                </li>
                <li>
                    <img src="../imgs/3333.jpg" alt="">
                    <p>梨</p>
                </li>
                <li>
                    <img src="../imgs/4444.jpg" alt="">
                    <p>葡萄/提子</p>
                </li>
                <li>
                    <img src="../imgs/5555.jpg" alt="">
                    <p>柚子</p>
                </li>
            </ul>
            <a href="" class="listBtn">进入农产品分类>></a>
        </div>
        <div class="productList">
            <ul>
                <li>
                    <img src="../imgs/1111.jpg" alt="">
                    <p>苹果</p>
                </li>
                <li>
                    <img src="../imgs/2222.jpg" alt="">
                    <p>橙子</p>
                </li>
                <li>
                    <img src="../imgs/3333.jpg" alt="">
                    <p>梨</p>
                </li>
                <li>
                    <img src="../imgs/1111.jpg" alt="">
                    <p>苹果</p>
                </li>
                <li>
                    <img src="../imgs/2222.jpg" alt="">
                    <p>橙子</p>
                </li>
                <li>
                    <img src="../imgs/3333.jpg" alt="">
                    <p>梨</p>
                </li>
                <li>
                    <img src="../imgs/4444.jpg" alt="">
                    <p>葡萄/提子</p>
                </li>
                <li>
                    <img src="../imgs/5555.jpg" alt="">
                    <p>柚子</p>
                </li>
            </ul>
            <a href="" class="listBtn">进入农产品分类>></a>
        </div>
        <div class="productList">
            <ul>
                <li>
                    <img src="../imgs/1111.jpg" alt="">
                    <p>苹果</p>
                </li>
                <li>
                    <img src="../imgs/2222.jpg" alt="">
                    <p>橙子</p>
                </li>
                <li>
                    <img src="../imgs/1111.jpg" alt="">
                    <p>苹果</p>
                </li>
                <li>
                    <img src="../imgs/2222.jpg" alt="">
                    <p>橙子</p>
                </li>
                <li>
                    <img src="../imgs/3333.jpg" alt="">
                    <p>梨</p>
                </li>
                <li>
                    <img src="../imgs/4444.jpg" alt="">
                    <p>葡萄/提子</p>
                </li>
                <li>
                    <img src="../imgs/5555.jpg" alt="">
                    <p>柚子</p>
                </li>
            </ul>
            <a href="" class="listBtn">进入农产品分类>></a>
        </div>
        <div class="productList">
            <ul>
                <li>
                    <img src="../imgs/1111.jpg" alt="">
                    <p>苹果</p>
                </li>
                <li>
                    <img src="../imgs/1111.jpg" alt="">
                    <p>苹果</p>
                </li>
                <li>
                    <img src="../imgs/2222.jpg" alt="">
                    <p>橙子</p>
                </li>
                <li>
                    <img src="../imgs/3333.jpg" alt="">
                    <p>梨</p>
                </li>
                <li>
                    <img src="../imgs/4444.jpg" alt="">
                    <p>葡萄/提子</p>
                </li>
                <li>
                    <img src="../imgs/5555.jpg" alt="">
                    <p>柚子</p>
                </li>
            </ul>
            <a href="" class="listBtn">进入农产品分类>></a>
        </div>
    </section>
    <footer>
        <a href=""><i class="iconfont">&#xe658;</i><p>首页</p></a>
        <a href="" style="color:#37d863;"><i class="iconfont">&#xe60d;</i><p>分类</p></a>
        <a href=""><i class="iconfont">&#xe726;</i><p>购物车</p></a>
        <a href=""><i class="iconfont">&#xe67b;</i><p>我的</p></a>
    </footer>
</div>
</body>
</html>